<template>
	<view style="min-height: 100vh;overflow: hidden;"
		:style="{background:'url('+Imgbase+'/1zhan_new_sbgc.jpg)','background-size':'100%',}">
		<!-- <cu-custom bgColor="bg-newblue" mesmes="true" :isBack="true">
			<block slot="content">下单发货</block>
		</cu-custom> -->
		<!--<cu-custom bgColor="bg-blue" :isBack="true"><block slot="content">下单发货</block></cu-custom>-->
		<!--<view class="solids-bottom flex align-center">
			<view class="flex-sub text-center bg-cyan text-bold">
				<view class="solid-bottom text-xl padding">
					<text class="text-white">订单详情:</text>
				</view>
			</view>
		</view>-->
		<view class="padding-bottom-30 padding-top-50 font-weight-500 padding-left-30" style="background-color: #F8F4EE;">
				<image class="w-80 h-80" :src="Imgbase + '/new_goodlx_img1.png'" mode="aspectFit" @click="back">
				</image>
			<!-- 下单发货 -->
		</view>
		
		<view class="bg-white text-center padding-top-20 font-weight-500">
			下单发货
		</view>
		
		<view class="cu-bar bg-white solid-bottom">
			<view class="action">
				<text class="cuIcon-titles text-orange "></text> 请选择地址信息
			</view>
		</view>
		<view class="solid-bottom bg-white" v-show="address != null" @click="changeAddress()">
			<view class="text-sm padding-sm text-grey">
				<view class="content fl text-ablack text-df">
					{{address.name}}
				</view>
				<view class="action fr text-ablack text-df">
					{{address.phone}}
				</view>
			</view>
			<view style="clear: both;"></view>
			<view class="text-sm padding-sm text-grey">
				<view class="content fl text-gray text-df">
					{{address.detail}}
				</view>
			</view>
			<view style="clear: both;"></view>
			<view style="width: 100%;height: 20upx;"></view>
		</view>
		<view class="solid-bottom bg-white" v-show="address == null" @click="toPage('goodspoor','addresslist')">
			<view class="solid-bottom text-xl padding">
				<text class="text-black">你还没有设置地址信息,请点击添加地址！</text>
			</view>
		</view>
		<view class="cu-bar bg-white solid-bottom">
			<view class="action">
				<text class="cuIcon-titles text-orange "></text> 请选择快递
			</view>
			<view class="fl" style="width: 25%;margin-right: 50rpx;">
				<image height="60" :src="Imgbase + '/backpack_b1.png'" mode="widthFix" @click="showExplain(6)">
				</image>
			</view>
		</view>
		<view class="solid-bottom bg-white">
			<radio-group @change="waysChanged">
				<view style="width: 100%;height: 10upx;"></view>
				<label class="radio" style="margin-left: 30upx;">
					<radio value="0" :checked="ways == 0" /><text style="color: #000000;">普通快递<text
							class="text-red">(满五件包邮,未满五件需支付{{expressmoney}}元邮费)</text></text>
				</label><br>
				<view style="width: 100%;height: 10upx;"></view>
				<label class="radio" style="margin-left: 30upx;">
					<radio value="1" :checked="ways == 1" /><text style="color: #000000;">顺丰到付</text>
				</label><br>
				<view style="width: 100%;height: 10upx;"></view>
				<!-- <label class="radio" style="margin-left: 30upx;">
					<radio value="2" :checked="ways == 2" /><text style="color: #000000;">发货到欧气动漫屋</text>
				</label> -->
			</radio-group>
			<view style="width: 100%;height: 10upx;"></view>
		</view>
		<view class="cu-form-group align-start">
			<view class="title">备注</view>
			<textarea placeholder="请输入备注" v-model="remark"></textarea>
		</view>
		<view style="clear: both;"></view>
		<view class="bg-white">
			<!--<button class="cu-btn bg-gray lg text-bold text-l fl"  style="line-height: 2.8em;width: 44%;margin-left: 3%;" @click="cancelPush()">取消</button>
			<button class="cu-btn bg-green lg text-bold text-l fl"  style="line-height: 2.8em;width: 44%;margin-left: 5%;" @click="pushDeliver()">确定</button>-->
			<view class="fl" style="width: 44%;margin-left: 3%;">
				<image :src="Imgbase + '/infinite_backpack_select_b3s.png'" mode="widthFix" @click="cancelPush()">
				</image>
			</view>
			<view class="fl" style="width: 44%;margin-left: 5%;">
				<image :src="Imgbase + '/infinite_backpack_select_b4s.png'" mode="widthFix" @click="pushDeliver()">
				</image>
			</view>
			<view style="clear: both;"></view>
			<view style="width: 100%;height: 40upx;"></view>
		</view>
		<view style="clear: both;"></view>
		<view class="cu-card article bg-white">
			<block v-for="(item,index) in list">
				<view class="cu-item shadow "
					style="position: relative;width: 27%;float: left;padding-bottom: 0rpx;margin-left: 26rpx;margin-right: 0rpx;margin-top: 0rpx;margin-bottom: 20rpx;">
					<view class="image" style="width: 100%;">
						<image :src="item.adimage" mode="aspectFill" style="height: 200rpx;width: 100%;"
							@click="viewImages(item.adimage)"></image>
						<view class=" text-white bg-black"
							style="margin-top: -40%;display: block;line-height: 30upx;opacity: 0.7;padding-left: 5rpx;">
							<view style="clear: both;"></view>
							<text class="text-sm"
								style="width: 100%;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;">
								{{item.goodmes.name}}
							</text>
							<view style="clear: both;"></view>
							<text class="text-sm" style="width: 100%;">
								{{item.reword_type_name}}赏
							</text>
							<view style="clear: both;"></view>
							<view class="" style="height: 70rpx;">
								<text class="text-sm" style="width: 100%;">
									参考价格￥{{item.back_price}}
								</text>
							</view>
							<view style="clear: both;"></view>
						</view>
					</view>
					<view class="fonts" style="position: absolute;right: 10rpx;top: 10rpx;color: #FBBD08;font-weight: bold;">
						x{{item.num}}
					</view>
				</view>
			</block>
			<!--<block v-for="(item,index) in list">
				<view class="cu-item shadow padding-top-xl" style="position: relative;">
					<view class="content">
						<image :src="item.adimage"
						 mode="aspectFill"></image>
						<view class="desc">
							<view class="">{{item.goodmes.name}}</view>
							<view class="">{{item.reword_type_name}}赏</view>
							<view class="">参考价格￥{{item.back_price}}</view>
							<view class="fl">
								<view class="text-gray text-sm flex justify-between action fr">
									获得时间:{{item.createtime_text}}
								</view>
							</view>
						</view>
					</view>
				</view>
				<view style="clear: both;"></view>
			</block>-->
		</view>
		<view class="" style="width: 100%;height: 50upx;"></view>
		<view class="cu-modal drawer-modal justify-end" :class="modalName=='showAddressList'?'show':''"
			@tap="hideModal">
			<view class="cu-dialog basis-lg padding-top-100" @tap.stop=""
				:style="[{top:CustomBar+'px',height:'calc(100vh - ' + CustomBar + 'px)'}]">
				<view class="cu-list menu text-left">
					<view class="cu-item arrow" v-for="(item,index) in addresslist" :key="index"
						@click="chooseAddress(index)">
						<view class="content">
							<view>{{item.name}}-{{item.phone}}</view>
							<view>{{item.detail}}</view>
						</view>
					</view>
				</view>
				<view class="cu-list menu text-left">
					<view class="cu-item arrow" @click="toPage('goodspoor','addresslist')">
						<view class="content">
							<view>添加地址</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="cu-modal" :class="modalName=='Modal'?'show':''" @tap="hideModal">
			<view class="cu-dialog" style="background-color:initial;">
				<view class="bg-img"
					:style="{background:'url('+Imgbase+'/gooddetail_alarm_bg4.png) no-repeat','background-size':'100% 100%','height':'1200rpx'}">
					<view style="width: 100%;height: 90upx;"></view>
					<scroll-view class="scroll padding-xl text-left" scroll-y="true" style="padding: 100rpx;"
						v-html="explain.content">
					</scroll-view>
				</view>
			</view>
		</view>
		<view style="clear: both;"></view>
		<view class="cu-load load-modal" v-if="loadModal">
			<image src="/static/icon.jpg" mode="aspectFit"></image>
			<view class="gray-text">加载中...</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				Imgbase: getApp().globalData.Imgbase,
				CustomBar: this.CustomBar,
				list: [],
				count: 0,
				address: null,
				ways: 0,
				remark: uni.getStorageSync('pushdeliver_remark') || '',
				address_id: 0,
				orderdata: '',
				modalName: null,
				addresslist: [],
				expressmoney: 0,
				loadModal: false,
				numss: '',
				isdui: '',
				explain: '',
				good_type: '',
				sele: 0
			};
		},
		onLoad(options) {
			if (options.type == 0) {
				this.good_type = 'cards'
				this.sele = 0
			} else {
				this.good_type = 'good'
				this.sele = 1
			}
			this.loadExpressMoney();
			let _this = this;
			_this.orderdata = options.data;
			_this.loadModal = true;
			if (options.nums > 300) {
				_this.numss = 300
			} else {
				_this.numss = options.nums
			}
			uni.request({
				url: _this.$globals.apibase + '/api/Usersys/deliverGoodDetailV2',
				data: {
					token: uni.getStorageSync('token'),
					data: options.data,
					dui: options.dui,
					good_type: _this.good_type
				},
				method: 'POST',
				header: {
					'content-type': 'application/json'
				},
				success: (res) => {
					if (res.data.code == '401') {
						uni.setStorageSync('token', '');
						_this.$uniApi.trylogin();
					}
					if (res.data.code == '1') {
						for (let i = 0; i < res.data.data.list.length; i++) {
							res.data.data.list[i].checked = 0;
							_this.list = _this.list.concat(res.data.data.list[i])
						}
						_this.orderdata = res.data.data.ids;
						_this.loadModal = false;
					}
					if (res.data.code == '0') {
						uni.showToast({
							icon: 'none',
							title: res.data.msg
						});
					}
				}
			});
		},
		onShow() {
			this.loadAddress()
		},
		methods: {
			back() {
				uni.navigateBack()
			},
			showExplain(id) {
				let _this = this;
				uni.request({
					url: _this.$globals.apibase + '/api/Index/explain',
					data: {
						id: id
					},
					method: 'POST',
					header: {
						'content-type': 'application/json'
					},
					success: (res) => {
						_this.explain = res.data.data.desc;
						_this.modalName = 'Modal'
					}
				});
			},
			viewImages(adimages) {
				let images = [];
				images = images.concat(adimages);
				uni.previewImage({
					urls: images,
					current: 0
				});
			},
			loadExpressMoney() {
				let _this = this;
				uni.request({
					url: _this.$globals.apibase + '/api/Luckgoods/expressMoney',
					data: {
						token: uni.getStorageSync('token'),
					},
					method: 'POST',
					header: {
						'content-type': 'application/json'
					},
					success: (res) => {
						if (res.data.code == '401') {
							uni.setStorageSync('token', '');
							_this.$uniApi.trylogin();
						}
						if (res.data.code == '1') {
							_this.expressmoney = res.data.data.expressmoney;
						}
					}
				});
			},
			chooseAddress(index) {
				this.address_id = this.addresslist[index].id;
				this.address = this.addresslist[index];
				this.modalName = null
			},
			changeAddress() {
				this.modalName = 'showAddressList';
			},
			hideModal(e) {
				this.modalName = null
			},
			loadAddress() {
				let _this = this;
				uni.request({
					url: _this.$globals.apibase + '/api/Luckorder/getDefaultAddress',
					data: {
						token: uni.getStorageSync('token'),
					},
					method: 'POST',
					header: {
						'content-type': 'application/json'
					},
					success: (res) => {
						if (res.data.code == '401') {
							uni.setStorageSync('token', '');
							_this.$uniApi.trylogin();
						}
						if (res.data.code == '1') {
							if (res.data.data.desc != null) {
								_this.address = res.data.data.desc
								_this.address_id = res.data.data.desc.id
							}

							_this.loadOtherAddress();
						}
						if (res.data.code == '0') {
							uni.showToast({
								icon: 'none',
								title: res.data.msg
							});
						}
					}
				});
			},
			loadOtherAddress() {
				let _this = this;
				uni.request({
					url: _this.$globals.apibase + '/api/Luckorder/addressList',
					data: {
						token: uni.getStorageSync('token'),
					},
					method: 'POST',
					header: {
						'content-type': 'application/json'
					},
					success: (res) => {
						if (res.data.code == '401') {
							uni.setStorageSync('token', '');
							_this.$uniApi.trylogin();
						}
						if (res.data.code == '1') {
							_this.addresslist = res.data.data.list2;
							for (let i = 0; i < res.data.data.list.length; i++) {
								_this.addresslist = _this.addresslist.concat(res.data.data.list[i])
							}
							if (_this.address == null) {
								_this.address = res.data.data.list2[0]
								_this.address_id = res.data.data.list2[0].id
							}
						}
					}
				});
			},
			toPage(folder, name, id = -1) {
				if (id == -1) {
					uni.navigateTo({
						url: `/pages/${folder}/${name}`
					});
				} else {
					uni.navigateTo({
						url: `/pages/${folder}/${name}?id=${id}`
					});
				}
			},
			waysChanged(e) {
				this.ways = e.detail.value;
			},
			cancelPush() {
				uni.navigateBack();
			},
			pushDeliver() {
				if (this.address_id == 0) {
					uni.showToast({
						icon: 'none',
						title: '请选择地址！'
					});
					return;
				}
				let _this = this;
				uni.setStorageSync('pushdeliver_remark', _this.remark);
				if (_this.ways == 0 || _this.ways == 1) {
					uni.showModal({
						title: '提示',
						content: '请核对您的信息无误后再次点击确认发货',
						success: function(res) {
							if (res.confirm) {
								uni.request({
									url: _this.$globals.apibase + '/api/Luckorder/pushDeliver',
									data: {
										token: uni.getStorageSync('token'),
										data: _this.orderdata,
										address_id: _this.address_id,
										ways: _this.ways,
										remark: _this.remark,
										ver: _this.$mpVer,
										good_type: _this.good_type
									},
									method: 'POST',
									header: {
										'content-type': 'application/json'
									},
									success: (res) => {
										if (res.data.code == '401') {
											uni.setStorageSync('token', '');
											_this.$uniApi.trylogin();
										}
										if (res.data.code == '1') {
											if (res.data.data.state == 1) {
												uni.showToast({
													icon: 'none',
													title: '下单发货成功',
													duration: 5000
												});
												setTimeout(() => {
													uni.navigateBack()
													// uni.reLaunch({
													// 	url: `/pages/goodspoor/backpack?sele=` +
													// 		_this.sele
													// });
												}, 1500)
											} else if (res.data.data.state == 0) {
												uni.requestPayment({
													timeStamp: res.data.data.result
														.timeStamp,
													nonceStr: res.data.data.result
														.nonceStr,
													package: res.data.data.result.package,
													signType: res.data.data.result
														.signType,
													paySign: res.data.data.result.paySign,
													success: function(result) {
														uni.showToast({
															icon: 'success',
															title: '下单发货成功',
															duration: 5000,
														});
														setTimeout(() => {
															uni.navigateBack()
															// uni.reLaunch({
															// 	url: `/pages/goodspoor/backpack?sele=` +
															// 		_this
															// 		.sele
															// });
														}, 1500)
													}
												})
											} else {
												uni.showToast({
													icon: 'none',
													title: '未知错误'
												});
											}
										}
										if (res.data.code == '0') {
											uni.showToast({
												icon: 'none',
												title: res.data.msg
											});
										}
									}
								});
							} else if (res.cancel) {}
						}
					});
				}
				if (_this.ways == 2) {
					var allcount = 0;
					var allmoney = 0;
					for (let i = 0; i < _this.list.length; i++) {
						allcount += 1;
						allmoney += parseFloat(_this.list[i].back_price * _this.list[i].num);
					}
					uni.showModal({
						title: '提示',
						content: '请问您确认要将选中的物品发货到欧气动漫屋中吗？共计' + _this.numss + '件,共计' + allmoney + '元',
						success: function(res) {
							console.log(_this.orderdata)
							if (res.confirm) {
								_this.loadModal = true;
								uni.request({
									url: _this.$globals.apibase + '/api/Luckorder/pushDeliver',
									data: {
										token: uni.getStorageSync('token'),
										address_id: _this.address_id,
										ways: _this.ways,
										data: _this.orderdata,
										remark: _this.remark,
										ver: _this.$mpVer,
										good_type: _this.good_type
									},
									method: 'POST',
									header: {
										'content-type': 'application/json'
									},
									success: (res) => {
										_this.loadModal = false;
										if (res.data.code == '401') {
											uni.setStorageSync('token', '');
											_this.$uniApi.trylogin();
										}
										if (res.data.code == '1') {
											if (res.data.data.state == 1) {
												uni.showToast({
													icon: 'none',
													title: '转卖成功',
													duration: 5000
												});
												setTimeout(() => {
													uni.reLaunch({
														url: `/pages/index/index?mes=backpack`
													});
												}, 1500)
											} else if (res.data.data.state == 0) {
												uni.requestPayment({
													timeStamp: res.data.data.result
														.timeStamp,
													nonceStr: res.data.data.result
														.nonceStr,
													package: res.data.data.result.package,
													signType: res.data.data.result
														.signType,
													paySign: res.data.data.result.paySign,
													success: function(result) {
														uni.showToast({
															icon: 'success',
															title: '转卖成功',
															duration: 5000,
														});
														setTimeout(() => {
															uni.reLaunch({
																url: `/pages/index/index?mes=backpack`
															});
														}, 1500)
													}
												})
											} else {
												uni.showToast({
													icon: 'none',
													title: '未知错误'
												});
											}
										}
										if (res.data.code == '0') {
											uni.showToast({
												icon: 'none',
												title: res.data.msg
											});
										}
									}
								});
							} else if (res.cancel) {}
						}
					});
				}
			},
		}
	}
</script>

<style>
	.fl {
		float: left;
	}

	.fr {
		float: right;
	}

	.fonts {
		-webkit-text-stroke: 1rpx #000;
		text-stroke: 1rpx #000;
		font-size: 34rpx;
	}
</style>